/* 微信小程序风格 */
body {
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
    Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: #f7f7f7;
}

.app-container {
  position: relative;
  max-width: 500px;
  margin: 0 auto;
  min-height: 100vh;
  background-color: #f7f7f7;
  overflow: hidden;
}

/* 微信小程序头部样式 */
.wx-header {
  background-color: #ffffff;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  border-bottom: 1px solid #f0f0f0;
}

.wx-header-title {
  font-size: 17px;
  font-weight: 500;
  color: #000;
}

.wx-header-back {
  position: absolute;
  left: 10px;
}

.wx-header-action {
  position: absolute;
  right: 10px;
}

/* 微信小程序内容区域 */
.wx-content {
  flex: 1;
  overflow-y: auto;
  padding-bottom: 50px; /* 为底部导航留出空间 */
}

/* 卡片样式 */
.wx-card {
  background-color: #fff;
  border-radius: 8px;
  margin-bottom: 10px;
  padding: 12px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

/* 按钮样式 */
.wx-button {
  background-color: #07c160;
  color: white;
  border: none;
  border-radius: 4px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
}

.wx-button-outline {
  background-color: transparent;
  color: #07c160;
  border: 1px solid #07c160;
}

/* 输入框样式 */
.wx-input {
  border: 1px solid #e5e5e5;
  border-radius: 4px;
  padding: 8px 12px;
  font-size: 14px;
  width: 100%;
}

/* 标签样式 */
.wx-tag {
  display: inline-block;
  padding: 2px 6px;
  font-size: 12px;
  border-radius: 4px;
  margin-right: 6px;
  background-color: #f2f2f2;
  color: #666;
}

.wx-tag-primary {
  background-color: #e6f7ff;
  color: #1890ff;
}

.wx-tag-success {
  background-color: #f6ffed;
  color: #52c41a;
}

/* 底部安全区域 */
.safe-area-bottom {
  height: env(safe-area-inset-bottom);
  background-color: #fff;
}